<template>
  <div class="topic">
    <basic-panel :isHeader="false">
      <topic-header :topicHeader="topicHeader"/>
      <topic-content :topicContent="topicContent"/>
    </basic-panel>

    <topic-comments class="reply" :topicComments="topicComments" :topicHeader="topicHeader"/>
  </div>
</template>

<script>
  import BasicPanel from '@components/common/panel/BasicPanel.vue'
  import TopicHeader from './childComp/TopicHeader'
  import TopicContent from './childComp/TopicContent'
  import TopicComments from './childComp/TopicComments'

  export default {
    name: 'topic-panel',
    data() {
      return {
        topic_id: null,
        topicContent: '',
        topicHeader: {},
        topicComments: [
          // {
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!腻害了,大佬!",
          // },
          // {
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },
          // {
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },{
          //   "commenter_avatar":"https://avatars1.githubusercontent.com/u/17062187?v=3&s=120",
          //   "prefer":1000,
          //   "commenter":"小白",
          //   "floor":1,
          //   "create_time":1617349248,
          //   "content":"腻害了,大佬!!!!",
          // },
        ]
      }
    },
    components: {
      BasicPanel,
      TopicHeader,
      TopicContent,
      TopicComments
    },
    created() {
      // 向服务器请求文章相关数据,回复后需要再次调用
      this.topic_id = parseInt(this.$route.params.id)
      this.getTopic()
    },
    methods: {
      getTopic() {
        this.$axios.getData.getTopic(this.topic_id)
        .then(res => {
          if(res.data.code == 0) {
            var topic = res.data.data
            this.topicContent = topic.content
            // 定义头部信息
            var {
              id,
              username,
              tag,
              title,
              view_num,
              created_at,
              status
            } = topic
            this.topicHeader = {
              id,
              username,
              tag,
              title,
              view_num,
              created_at,
              status
            }
            // 定义评论信息
            // this.topicComments = topic.comments
            this.getComment()
          }
          else {
            alert('网络繁忙，请稍后再试')
            this.$router.replace('/')
          }
        })
      },
      getComment() {
        this.$axios.getData.getComment(this.topic_id)
            .then(res => {
              if(res.data.code === 0) {
                this.topicComments = res.data.data === null ? [] : res.data.data
              }
              else {
                alert('网络繁忙，请稍后再试')
                this.$router.replace('/')
              }
            })
      }
    }
  }
</script>

<style scoped>
  .reply{
    margin-top: 10px;
  }
</style>
